import { createVuePlugin } from 'vite-plugin-vue2';
import ScriptSetup from 'unplugin-vue2-script-setup/vite';
import vueSetupExtend from 'vite-plugin-vue-setup-extend';

import chainingPlugin from './chaining';
import manyTagsPlugin from './many-tags';

export default [
  /* 允许vue2模板使用多元素 */
  manyTagsPlugin(),

  /* 处理 vue template 链判断运算符（?.）和Null判断运算符（??）通用解决方案 */
  chainingPlugin(),

  // [VUE2模板解析器](https://github.com/underfin/vite-plugin-vue2)
  createVuePlugin({
    jsx: true,
    include: [/\.vue$/, /\.md$/],
    vueTemplateOptions: {
      /* nodejs > 14 时处理 vue template 链判断运算符（?.）和Null判断运算符（??）另一解决方案，使用通用解决方案比此方案生成的文件相对小些 */
      /* 此方案需要自行安装依赖: vue-template-babel-compiler */
      //compiler: parseInt(process.version.replace('v', '')) > 14 ? require('vue-template-babel-compiler') : require('vue-template-compiler'),

      compilerOptions: {
        //为 preserve 时保留空格，以免改变视觉差异, 如果模板中严格使用了 &nbsp; 来定义空格，则建议使用 condense 来压缩页面
        whitespace: 'preserve'
      }
    },
    //配置处理 jsx 的 @vue/babel-preset-jsx 依赖选项
    jsxOptions: {
      vModel: false,
      compositionAPI: true
    }
  }),

  // Vue2使用vue3的script setup语法糖](https://www.npmjs.com/package/unplugin-vue2-script-setup)
  ScriptSetup(),

  // [script setup use name for SFC](https://github.com/vbenjs/vite-plugin-vue-setup-extend)
  vueSetupExtend()
];
